// flex 布局
.l-f {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	align-items: center;
}
.l-column {
	flex-direction: column;
}
.l-row-c {
	justify-content: center;
}
.l-row-sb {
	justify-content: space-between;
}
.l-row-ad {
	justify-content: space-around;
}
.l-row-start {
	justify-content: flex-start;
}
.l-row-end {
	justify-content: flex-end;
}
.l-col-c {
	align-items: center;
}
.l-col-start {
	align-items: flex-start;
}
.l-col-end {
	align-items: flex-end;
}
.l-wrap  {
	flex-wrap: wrap;
}
// flex 比例
@for $i from 1 through  12 {
	.l-f#{$i} {flex: $i}
}
// 宽度 rpx
@for $i from 1 through 10 {
	.l-w#{$i} {width: 75rpx * $i}
}
// 高度 rpx
@for $i from 1 through 100 {
	.l-h#{$i} {height: 1rpx * $i}
}

// 背景颜色
.l-bg-f {background-color: #FFFFFF;}
.l-bg-f5 {background-color: #f5f5f5;}
.l-bg-e {background-color: #eeeeee;}

// 字体颜色
.l-color-f {color: #FFFFFF;}
.l-color-3 {color: #333333;}
.l-color-6 {color: #666666}
.l-color-9 {color: #999999;}

// 字体大小
@for $i from 1 through 10 {
	.l-size#{$i} {font-size: 20rpx + 2*$i;}
}

// 字体粗细
@for $i from 1 through 9 {
	.l-font-w#{$i} {font-weight: 100 * $i;}
}

// margin
@for $i from 1 through 50 {
	.l-mg#{$i} {margin: 1rpx * $i;}
}
// margin 生成4个方向
@each $m in top,left,right,bottom {
	@for $i from 1 through 50 {
		.l-mg-#{$m}#{$i} {margin-#{$m}: 1rpx * $i;}
	}
}

// padding
@for $i from 1 through 50 {
	.l-pd#{$i} {
		padding: 1rpx * $i;
		/* #ifndef APP-NVUE */
		box-sizing: border-box;
		/* #endif */
		}
}

// padding 生成4个方向
@each $m in top,left,right,bottom {
	@for $i from 1 through 50 {
		.l-pd-#{$m}#{$i} {
			padding-#{$m}: 1rpx * $i;
			/* #ifndef APP-NVUE */
			box-sizing: border-box;
			/* #endif */
		}
	}
}

// 圆角
@for $i from 1 through 25 {
	.l-radius#{$i} {border-radius: 2rpx * $i;}
}
.l-radius-s {border-radius: 50%;}

// 超出行数，自动显示行尾省略号，最多5行
// 来自uView的温馨提示：当您在控制台看到此报错，说明需要在App.vue的style标签加上【lang="scss"】
@for $i from 1 through 5 {
	.l-line#{$i} {
		// vue下，单行和多行显示省略号需要单独处理
		@if $i == '1' {
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		} @else {
			overflow: hidden;
			text-overflow: ellipsis;
			/* #ifndef APP-NVUE */
			display: -webkit-box!important;
			word-break: break-all;
			-webkit-line-clamp: $i;
			-webkit-box-orient: vertical!important;
			/* #endif */
			/* #ifdef APP-NVUE */
			line: $i;
			/* #endif */
		}
	}
}
// 状态栏
.l-status-bar {
	height: var(--status-bar-height);
}
.hover-class {
	opacity: .5;
}
.hover-scale {
	transform: scale(.95);
}
.m-min100 {
	min-height: 100vh;
}
.m-bg {
	background-color: #F6F7FB;
}
// 分享按钮透明
.g-share-btn {
	background-color: transparent !important;
	padding: 0;
	&::after {
		border: none;
	}
}